<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title></title>
<link rel="stylesheet" href="../layui/css/layui.css">
<link rel="stylesheet" href="../css/general.css">
<link rel="stylesheet" href="../css/reports.css">
</head>
<body class="layui-layout-body">
<div id="apartment-daily-index" class="layui-layout layui-layout-admin">
	<div class="layui-header">
		<div class="layui-logo"><img src="../img/common/logo.jpg" alt=""></div>
		<!-- 头部区域（可配合layui已有的水平导航） -->
		<h1>魔力公寓</h1>
		<ul class="layui-nav layui-layout-right">
			<li class="layui-nav-item"> <a href="javascript:;">{{userinfo.loginName}}<img src="../img/common/icon07.gif" class="layui-nav-img"></a>
				<dl class="layui-nav-child">
					<dd><a href="../staff/modify_password.html"><img src="../img/common/icon08.png" alt=""><span>修改密码</span></a></dd>
					<dd><a href="../staff/bank_card.html"><img src="../img/common/icon09.png" alt=""><span>银行卡信息</span></a></dd>
					<dd><a href="javascript:;" @click.stop="doLogout"><img src="../img/common/icon10.png" alt=""><span>安全退出</span></a></dd>
				</dl>
			</li>
		</ul>
	</div>
	<div class="layui-side layui-bg-black">
		<div class="layui-side-scroll"> 
			<!-- 左侧导航区域（可配合layui已有的垂直导航） -->
			<ul class="layui-nav layui-nav-tree"  lay-filter="test">
				<li class="layui-nav-item"><a href="../survey/index.html"><img src="../img/common/icon01.png" alt="">概况</a></li>
				<li class="layui-nav-item"><a href="../rental/index.html"><img src="../img/common/icon02.png" alt="">租务</a></li>
				<li class="layui-nav-item"><a href="../financial_affairs/index.html"><img src="../img/common/icon03.png" alt="">财务</a></li>
				<li class="layui-nav-item on"><a href="../reports/index.html"><img src="../img/common/icon04.png" alt="">报表</a></li>
				<li class="layui-nav-item"><a href="../separate_accounts/index.html"><img src="../img/common/icon05.png" alt="">分账</a></li>
				<li class="layui-nav-item"><a href="../staff/index.html"><img src="../img/common/icon06.png" alt="">员工</a></li>
			</ul>
		</div>
	</div>
	<div class="layui-body"> 
		<!-- 内容主体区域 -->
		<div class="leftContent">
			<ul class="layui-menu">
				<li><a href="index.html" class="on">历史概况</a></li>
				<li><a href="rental_record.html">租务记录</a></li>
			</ul>
		</div>
		<div class="rightContent">
			<div class="section">
				<div class="layui-date">
					<input :class="status.startDateClassObj" @focus="changeStatus('startDateClassObj', 'isActive')" @blur="changeStatus('startDateClassObj', 'isFinish')" type="text" id="startDate" v-model="search.startDate">
					-
					<input :class="status.endDateClassObj" @focus="changeStatus('endDateClassObj', 'isActive')" @blur="changeStatus('endDateClassObj', 'isFinish')" type="text" id="endDate" v-model="search.endDate">
				</div>
				<table class="layui-table" lay-even>
					<colgroup>
					<col width="9%">
					<col width="9%">
					<col width="9%">
					<col width="9%">
					<col width="9%">
					<col width="9%">
					<col width="9%">
					<col width="9%">
					<col width="9%">
					<col width="9%">
					<col width="10%">
					</colgroup>
					<thead>
						<tr>
							<th>日期</th>
							<th>新租</th>
							<th>退租</th>
							<th>总房间数</th>
							<th>已租</th>
							<th>空置</th>
							<th>空置率</th>
							<th>收入租金（元）</th>
							<th>收入押金（元）</th>
							<th>收入杂费（元）</th>
							<th>支出金额（元）</th>
						</tr>
					</thead>
					<tbody v-if="false">
						<tr>
							<td>2018.03.19</td>
							<td>15</td>
							<td>1</td>
							<td>150</td>
							<td>150</td>
							<td>0</td>
							<td><span class="vacant">0</span></td>
							<td><span class="money">30000.00</span></td>
							<td>30000.00</td>
							<td>3659.00</td>
							<td><span class="money">0</span></td>
						</tr>
						<tr>
							<td>2018.03.19</td>
							<td>12</td>
							<td>0</td>
							<td>132</td>
							<td>132</td>
							<td>0</td>
							<td><span class="vacant">0</span></td>
							<td><span class="money">24000.00</span></td>
							<td>24000.00</td>
							<td>16952.00</td>
							<td><span class="money">0</span></td>
						</tr>
						<tr>
							<td>2018.03.19</td>
							<td>11</td>
							<td>0</td>
							<td>132</td>
							<td>132</td>
							<td>2</td>
							<td><span class="vacant">1.52%</span></td>
							<td><span class="money">22000.00</span></td>
							<td>22000.00</td>
							<td>1326.00</td>
							<td><span class="money">0</span></td>
						</tr>
						<tr>
							<td>2018.03.19</td>
							<td>5</td>
							<td>6</td>
							<td>131</td>
							<td>131</td>
							<td>1</td>
							<td><span class="vacant">0.76%</span></td>
							<td><span class="money">10000.00</span></td>
							<td>10000.00</td>
							<td>6699.00</td>
							<td><span class="money">100.00</span></td>
						</tr>
					</tbody>
					<tbody v-if="datas.dailyList.length>0">
						<tr v-for="t in datas.dailyList">
							<td v-text="t.date">2018.03.19</td>
							<td v-text="t.rentNewRoom">5</td>
							<td v-text="t.rentBackRoom">6</td>
							<td v-text="t.totalRoom">131</td>
							<td v-text="t.renting">131</td>
							<td v-text="t.emptyRoom">1</td>
							<td v-text="t.emptyPercent"><span class="vacant">0.76%</span></td>
							<td v-text="t.rent"><span class="money">10000.00</span></td>
							<td v-text="t.deposit">10000.00</td>
							<td v-text="t.otherFees">6699.00</td>
							<td v-text="t.refund"><span class="money">100.00</span></td>
						</tr>
					</tbody>
				</table>
				<div v-if="datas.dailyList.length>0" id="laypage"></div>
				<div v-if="datas.dailyList.length==0" class="nothing-box">暂无历史概况</div>
			</div>
		</div>
	</div>
</div>
<script src="../layui/layui.js"></script>
<script src="../js/jquery-3.3.1.min.js"></script>
<script src="../js/moment.min.js"></script>
<script src="../js/storejson2.min.js"></script>
<script src="../js/mock.js"></script>
<script src="../js/mockdata.js"></script>
<script src="../js/vue.min.js"></script>
<script src="../js/vue.global.js"></script>
<script src="../js/reports/index.js"></script>
</body>
</html>